<template>
  <div style="background:#999;">
    <h1>{{msg}}</h1>
    <slot name="up"></slot>
    <h2>父组件传过来的值-------{{dataFa}}</h2>
    <div v-if="msgA">false不显示我，true显示我</div>
    <slot></slot>
    <button @click="testSon01">子组件的按钮</button>
    
  </div>
</template>

<script>
export default {
  name: 'testSon',
  props:{
      dataFa:{//父组件传到子组件的参数，不能修改，只能使用, 当父组件传值后，子组件默认值将被覆盖
           type: String,
            // 对象或数组默认值必须从一个工厂函数获取
            default: function () {
              return "当前为子组件值"
            }
        }
  },
  data() {
    return {
      msg: "这里是子组件",
      msgA:false
    };
  },
  methods: {
      testSon(){
          this.msg = this.msg+"-----此方法是被父组件调用的子方法"
      },
      testSon01(){
        this.msgA = !this.msgA
        this.$emit('faMethod','-------子组件方法的参数+++')
      }
  }
};
</script>

<style scoped>
</style>
